<template>
<div v-if="this.flowVisible">
	<a-modal
		:title="this.flowTitle"
		:visible="this.flowVisible"
		:width="960"
   		@cancel="cancel"
   		@ok="ok"
	>
	<a-spin tip="Loading..." :spinning="showLoading">
	<iframe id="iframe"  ref="iframe" :src="this.flowUrl"  class="iframeWrapper" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes"></iframe>
	</a-spin>
  </a-modal>
  </div>
</template>

<script>
  import aModal from "@/common/modal"
  import global from "@/../static/global.vue"
export default{
	inject:['reload'],                                 //注入App里的reload方法
	name: "flowModal",
	props: ['flowTitle', 'flowVisible'],
	components: {
		aModal
	},
	data () {
		return {
			loading: true,
			flowUrl:"/#/flowArrange",
        showLoading:true
		}
	},
   updated(){
    const self = this;
     if(localStorage.getItem("spinning")=="true"){
        self.showLoading=true
      }else{
        self.showLoading=false
      }
     const iframe  = self.$refs.iframe;
    if(iframe){
      iframe.onload = function () {
        localStorage.setItem("spinning", false)
        self.showLoading=false
      };
    }

  },
	methods: {
   	 ok(e) {
         var iframe = this.$refs.iframe;
         iframe.contentWindow.getJson()
   	 	  this.$emit("cancel", e)
      },
      /*关闭modal*/
      cancel(e) {
        this.$emit("cancel", e)
      },
      spinning(){
        this.loading=true
      }
    }
  }

</script>

<style scoped>
.iframeWrapper{
	width: 100%;
	height: 600px;
}
.spin-content {
  border: 1px solid #91d5ff;
  background-color: #e6f7ff;
  padding: 30px;
}
</style>
